<style>
.all{
    height:100%;
    width:100%;
    font-size: 15px;
}
.subpage_title{
    line-height:3rem;
    text-align: center;
    background:#fff;
    border-bottom:1rem solid #f3f5f9;
}
.weui-cell{
    background:#fff;
    width:90%;
    line-height:2rem;
}
.weui-label{
    /* background:green; */
    width:5.5rem !important;
    text-align: left;
}
.bz{
    padding:5px 15px;
}

.vux-x-textarea{
    border:1px solid #ccc;
    width:82%;
    margin-left:15px;
}
.vux-cell-box:not(:first-child):before{
    /* border:5px solid yellow; */
    border:0px;
}
.vux-cell-box:not(:first-child):before{
    border:0px!important;
}
.vux-cell-box{
    border-top: 1px solid #D9D9D9;
    width:94%;
    margin:0 auto;
    text-align: left;
}
.bz{
    border-top: 1px solid #D9D9D9;
    width:93%;
    margin:0 auto;
    text-align: left;
    padding:10px 0px 10px 0px;
}
.vux-cell-box>.weui-cell{
    padding-left:0px;
    width:95%;
}
.weui-btn_default{
    border:0px;
    background:#fff!important;
    color:#00b7ee!important;
}
.weui-btn:after{
    border-radius: 0px !important;
    border:0px !important;
    border-left:1px solid #cacaca !important;
}

.weui-cell__hd{
    display:inline-block;
}
.start > .weui-cell__hd:first-letter{
    color:red;
    font-size:8px;
}
.getSubmit{
    /* background:red; */
    width:100%;
    height:3.45rem;
    line-height: 3.45rem;
    padding:0px 0px 0px 15px;
    position:absolute;
    bottom:0px;
    display: flex;
    flex-flow:row nowrap;
    justify-content:space-between;
    border-top:1px solid #D9D9D9;
}
.getSubmit span{
    color:red;
}
.getSubmit button{
    width:35%;
    height:100%;
    border:0px;
    background:#00b7ee;
    color:#fff;
    font-size:16px;
    
}
</style>

<template>
    <div class="all">
        <div class="subpage_title">您正在预约：{{this.$route.params.title}}</div>
        <div class="subpage_center">
            <x-input title="★联系人:" class="start" name="username" placeholder="请输入姓名" is-type="china-name"></x-input>
            <x-input title="★联系电话:" class="start" placeholder="请输入您的联系方式" mask="999 9999 9999"  is-type="china-mobile" required><!-- <x-button slot="right" mini>发送验证码</x-button> --></x-input>
            <x-input title="★验证码:" class="start" placeholder="请输入您的验证码">
                <img slot="right-full-height" src="https://ws1.sinaimg.cn/large/663d3650gy1fq684go3glj203m01hmwy.jpg">
            </x-input>
            <x-input title="★所在地区:" class="start"  name="username" placeholder="请输入城市" value-text-align="left" show-name></x-input>
            <x-input title="★楼宇名称:" class="start"  name="username" placeholder="请输入您所在的楼宇名称" value-text-align="left" show-name></x-input>
            <x-input title=" 企业名称:" class="qymc" placeholder="请输入企业名称"></x-input>
            <div class="bz">备注:</div>
            <x-textarea  name="detail" placeholder="请输入备注信息" :show-counter="false">12313</x-textarea>
        </div>
        <div class="getSubmit">
            <p>注"<span>*</span>"为必填信息</p>
            <button>提交预约</button>   
        </div>
    </div> 
</template>

<script>
import { XInput,PopupPicker ,XTextarea ,Swiper,Group,GroupTitle, Grid, GridItem, Panel,XButton,Marquee, MarqueeItem } from 'vux'
export default {
    data() {
        return {

        }
    },
    methods:{

    },
    components: {
        XInput,
        Swiper,
        GroupTitle,
        Grid, GridItem,
        Panel,
        XButton,
        Marquee, MarqueeItem,Group,GroupTitle,PopupPicker,XTextarea
    }
}
</script>



